/**
 * Created by Dalyn on 2017/2/28.
 */
import React from 'react';
import EventManager from '../../util/EventManager'
import Select from "../../common/Select";
import Confirm from '../../common/Confirm';
import {hashHistory} from 'react-router';
import UpdatePwdModal from '../sysmanager/UpdatePwdModal'
import './css/Title.css'

export default class Head extends React.Component {
    constructor(props){
        super(props);
        this.text={
            select:[
                {text:"东方制衣有限公司1",value:"c1"},
                {text:"东方制衣有限公司2",value:"c2"},
                {text:"东方制衣有限公司3",value:"c3"},
                {text:"东方制衣有限公司4",value:"c4"},
                {text:"东方制衣有限公司5",value:"c5"}
            ]
        }
        this.style = {
            confirm: {
                width: '89px',
                height: '34px',
                fontSize: "14px",
                color: "#fff",
                fontFamily: "Microsoft YaHei",
                backgroundColor:"#484848",
                border:"1px solid #ededed",
            },
            select:{
                width:314,
                height:34,
                display:"inlineBlock",
                marginTop:14,
                marginLeft:14,
                borderWidth:"1px solid",
                borderColor:"#e7e6e6",
            }
        };
        this.msUid = sessionStorage.getItem("msUid");
    }
    componentWillMount(){

    }

    /*退出登录*/
    quit(){

        sessionStorage.removeItem('msToken');
        sessionStorage.removeItem('msUid');
        sessionStorage.removeItem('msUserName');
        sessionStorage.removeItem('pIds');
        EventManager.emitter('islogin',false);
        hashHistory.push('/');
    }

    /*修改密码*/
    modifyPwd(){
        this.refs.UpdatePwdModal.setState({
            visible : true,
        })
        // 清空它的内容值
        setTimeout(()=>{this.refs.UpdatePwdModal.clear();})
    }

    render() {
        let userName = sessionStorage.getItem("msUserName");
        return(
            <div style={Style.head} className="clear">
                <div className="leftBox">
                    <ul>
                        <li style={{"borderRight":"1px solid #fff"}}><img style={Style.logo} src="./img/main_logo.png" alt="衣有道"/></li>
                        <li><span style={{"fontSize":"22px",fontFamily:" Microsoft YaHei"}}>后台系统</span></li>
                    </ul>
                </div>
                <div className="rightBox">
                    <ul>
                        <li style={{"borderRight":"1px solid #fff"}} onClick={this.modifyPwd.bind(this)}>修改密码</li>
                    </ul>
                    <ul>
                        <li><i className="title_ico3"></i>{userName}</li>
                    </ul>
                    <p className="quit" onClick={this.quit.bind(this)}><i className="quit_ico"></i>退出</p>
                </div>
                <UpdatePwdModal ref={"UpdatePwdModal"} managerId={this.msUid}/>
            </div>
        );
    }
}
let Style = {
    head:{
        width: '100%',
        height:"63px",
        clear:"both",
        overflow:"hidden",
        background:"#484848"
    },
    title:{
        float:"left",
        fontSize:"30px",
        color:"#49b5cf",
        padding:"0 20px",
        lineHeight:"40px"
    },
    manage:{
        float:"right",
        paddingTop:"14px"
    },
    package:{
        float:"left",
        marginLeft:"30px",
        textAlign:"center",
    },
    i_por:{
        display:"inline-block",
        width:"16px",
        height:"16px",
        background:"url('./img/main_sp.png') no-repeat 0 0",
        verticalAlign:"-3px"
    },
    span:{
        fontSize:"14px",
        color:"#ffffff",
        padding:"0 8px",
        lineHeight:"40px"
    },
    name:{
        fontSize:"14px",
        color:"#ffffff",
        paddingLeft:"14px",
        lineHeight:"36px",
    },
    login:{
        float:"right",
        width: '300px',
        height:"36px",
        paddingTop:"14px",
        marginRight:"50px"
    },
    b:{
        float:"left",
        width:"1px",
        height:"16px",
        background:"#A8A8A8",
        margin:"9px 20px 0"
    },
    button:{
        float:"right",
    },
    logo:{
        /*width:"100%",
        height:"100%"*/
    }
}